<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <div>
        <button type="button" onclick="test0()">0、方法名加括号，有效</button>
        <button type="button" onclick="test1">1、方法名不加括号，无效</button>
        <button onclick="test2()">2、不加type，有效</button>
        <button onclick="test3(1,2,3)">3、携带参数</button>
        <button onclick="test4()">4、看看有无默认参数</button>

        <button onclick="test51()">5、获取事件对象（隐式）</button>
        <button onclick="test52(event)">5、获取事件对象（显式）</button>
        <button onclick="test53(e)">5、获取事件对象失败！参数名不叫event，报错说是 e 未定义</button>

        <button onclick="test61(111)">6、获取事件对象，带参数（隐式）</button>
        <button onclick="test62(event,111)">6、获取事件对象，带参数（显式）</button>




    </div>

</body>

<script type="text/javascript">
    function test0() {
        console.log("点击了0#")
    }
    function test1() {
        console.log("点击了1#")
    }
    function test2() {
        console.log("点击了2#")
    }
    function test3(a, b, c) {
        console.log("点击了3#", a, b, c)
    }
    function test4(a, b, c) {
        console.log("点击了4#", a, b, c)
        console.log("this:", this)  //拿到的是window对象
    }
    function test51() {
        console.log("点击了51#", window.event)  //隐式的，不传参，直接用window.event暴力获取
    }
    function test52(e) {
        console.log("点击了52#", e)  //显式的，传入一个event
        console.log("1#", e.target)  //常用属性，获取当前元素
        console.log("2#", e.target.innerText)  //常用属性，获取元素中的文本
    }
    function test53(e) {
        console.log("点击了53#", e)  //报错！e未定义
    }
    function test61(a) {
        console.log("点击了61#，事件：", window.event, ", 参数：", a)  //隐式带参数，OK
    }
    function test62(e, a) {
        console.log("点击了62#，事件：", e, ", 参数：", a)  //显式带参数，OK
    }
</script>

</html>